import { Component, OnInit,HostListener } from '@angular/core';
import { MyHttp } from '../../service/MyHttp';
declare let AMap:any;
declare let $:any;
declare let window:any;
@Component({
  selector: 'app-dashboard',
  templateUrl: './dashboard.component.html',
  styleUrls: ['./dashboard.component.css']
})

export class DashboardComponent implements OnInit { 
  totaldata = {user_count:'',device_count:'',malfunction_count:'',order_count:'',today_revenue:'',total_revenue:''};
  constructor(private myHttp: MyHttp) {

  }

  getcount(){
    this.myHttp.post('homepage/getOverviewInfo', {}).subscribe(res => {
      console.log(res)
      if (res.errorCode == 0) {
        this.totaldata = res.message;
      }
  
    });
  }

  statgroup(){
    this.myHttp.post('homepage/getTopFiveTodayGroupRevenue', {}).subscribe(res => {  
      console.log(res)   
      if(res.errorCode == 0){
        this.statChart('groupstat','当日营收前5名的群组统计','从凌晨00:00到当前时间的营收统计',res.message)
      }    
  
    });
  }

  stat7day(){
    this.myHttp.post('homepage/getSumSevenDaysRevenue', {}).subscribe(res => {
      if(res.errorCode == 0){
        this.statChart('7totalstat','近7日总营收','到当前时间7天的每天总营收统计',res.message)
      }
     
  
    });
  }
  
  stat30week(){
    this.myHttp.post('homepage/getFourWeekRevenue', {}).subscribe(res => {
      if (res.errorCode == 0) {       
        this.statChart('30weekstat','近一个月每周总营收','到这周为止近一个月（前4周）的每周总营收统计',res.message) 
      }
  
    });
  }

  stat30Interval(){
    this.myHttp.post('homepage/getIntervalRevenue', {}).subscribe(res => {
      
      var mdata = [['0:00~3:00'],['3:00~6:00'],['6:00~9:00'],['9:00~12:00'],['12:00~15:00'],['15:00~18:00'],['18:00~21:00'],['21:00~24:00']];
      if (res.errorCode == 0) {       
        for(var i=0;i<res.message.length;i++){
          mdata[i][1] = res.message[i]          
        }      
        this.statChart('30timequanyumstat','近1个月各时间段营收累计','每3个小时为一个时间段，一天8个时间段，对近一个月各时间段的总营收的统计',mdata) 
       
      }
  
    });
  }


  
ngOnInit() {  
   this.getcount();
   this.statgroup();
   this.stat7day();
   this.stat30week();
   this.stat30Interval();
  }

  statChart(id,text,subtext,data){
      $('#'+id).highcharts({
        title: {
          text: text
      },
  
      subtitle: {
          text: subtext
      },
  
      xAxis: {
        type: 'category',
        labels: {
            // rotation: -45,
            style: {
                fontSize: '13px',
                fontFamily: 'Verdana, sans-serif'
            }
        }
      }, 
      yAxis: {
        min: 0,
        title: {
            text: '营收 （元）'
        }
      },
      tooltip: {
        // headerFormat: '<b>{categories}</b><br/>',
        pointFormat: '营收: {point.y}元'
      },  
      credits: {  
        enabled: false  
      }, 
      series: [{
          type: 'column',
          colorByPoint: true,
          data:data, 
          showInLegend: false
     
        }]        
    });
  }

    




}
